// 写一个vuex的分模块 管理购物车的模块

let cartStore = {
  // 分模块的特殊属性namespaced: true
  namespaced: true, //开启命名空间 防止命名冲突
  state: {
    cartList: [ //购物车列表
      { id: 1, price: 20, name: "手机" },
      { id: 2, price: 30, name: "电脑" },
      { id: 3, price: 40, name: "电视" }
    ]
  },
  mutations: {
    changeCart (state, product) { // 修改购物车的方法
      // 将新商品添加到 state数组中
      state.cartList.push(product)
    }
  },
  actions: { //异步修改state的方法
    actCart ({ commit }, product) {
      // actions 无法直接修改 触发mutations修改
      commit("changeCart", product)
    }
  },
  getters: {
    myCartList (state) { //计算属性
      return state.cartList.map(item => {
        item.name = "【限时抢购】" + item.name
        return item
      })
    }
  }
}
// 导出分模块
export default cartStore